<!DOCTYPE >
<html >
    <meta charset="utf-8"/>
    <style>

ul {
    list-style-type: none;
  
  padding: 0;
  overflow: hidden;
  background-color:grey;
  margin-left: 160px; 
  font-size: 28px; 
  padding: 0px 10px;
 
  max-width: fit-content;
}

li {
  float:left;
}

li a, .dropbtn {
  display: inline-block;
  color: white;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}

li a:hover, .dropdown:hover .dropbtn {
  background-color: pink;
}

li.dropdown {
  display: inline-block;
}

.dropdown-content {
  display: none;
  position: absolute;
  background-color: #f9f9f9;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}

.dropdown-content a {
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  text-align: left;
}

.dropdown-content a:hover {background-color: #f1f1f1;}

.dropdown:hover .dropdown-content {
  display: block;
}
</style>
</head>
<body background="th.jfif">
<header>
    <div >
        <img src="allianz.webp"  width="100%" height="300px">
        <span style="position: absolute; top: 100; left: 400;">Welcome to Sebennastraße - home of Bayern Munich - Southern Star - Allianz Arena</span>
        
            </div>

<ul>
  <li><a href="#home">NEWS</a></li>
  <li><a href="#news">BULLETIN</a></li>
  <li><a href="#home">GLORY</a></li>
  <li><a href="#home">HISTORY</a></li>
  <li class="dropdown">
    <a href="javascript:void(0)" class="dropbtn">CLUB</a>
    <div class="dropdown-content">
      <a href="#">TEAM</a>
      <a href="#">EVENT</a>
      <a href="#">TICKET</a>
    </div>
  </li>
</ul>
</header>
<main>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
body {
  font-family: "Lato", sans-serif;
}

.sidenav {
  height: 100%;
  width: 160px;
  position: fixed;
  z-index: 1;
  top: 0;
  left: 0;
  background-color: #111;
  overflow-x: hidden;
  padding-top: 20px;
}

.sidenav a {
  padding: 6px 8px 6px 16px;
  text-decoration: none;
  font-size: 25px;
  color: #818181;
  display: block;
}

.sidenav a:hover {
  color: #f1f1f1;
}

.main {
  margin-left: 160px; 
  font-size: 28px; 
  padding: 0px 10px;
  max-width: fit-content;
width:70%;
  border: 1px solid #3B6273;
}

@media screen and  (max-width: 50px)  {
  .sidenav {padding-top: 15px;}
  .sidenav a {font-size: 18px;}

}

footer {
  background-color: lightblue;
 
}


    </style>
</style>
</head>
<body>
    <div class="sidenav">
        <a href="#about">About</a>
        <a href="#services">Services</a>
      
        <a href="#contact">Contact</a>
      </div>


<div class="main">
  <h2>profile</h2>
  <p>拜仁慕尼黑足球俱乐部，简称拜仁慕尼黑或拜仁，是一家设于巴伐利亚州首府慕尼黑的德国体育俱乐部，其最著名的是参加德国足球甲级联赛的职业足球队，曾创纪录的赢得26次德国足球顶级联赛冠军及17次德国杯冠军，为德国最成功的足球俱乐部。 

    拜仁慕尼黑最早由弗朗茨·约翰率领11名足球运动员在1900年创立。尽管曾在1932年赢得首次德国联赛冠军，但俱乐部却并非德国足球甲级联赛于1963年成立之初的创始成员。其最强大的时期是1970年代中期，在弗朗茨·贝肯鲍尔的带领，曾连续3次（1974年-1976年）夺得欧洲冠军杯。整体而言，拜仁慕尼黑已11次进入欧洲冠军杯或欧洲冠军联赛的决赛，最近一次是在2020年，夺得俱乐部历史上的第六座冠军奖杯 。此外，拜仁慕尼黑也曾获得过1次欧洲联盟杯、1次欧洲优胜者杯、1次欧洲超级杯和3次洲际杯/丰田杯/世俱杯冠军。
 </p>
<img  style=" margin-left: 150px; width:700px"  src="首发.jpg">
<p>
    球队的主色调为红色及白色，队徽核心的蓝白格子则源自巴伐利亚州旗的颜色及样式。以收入计算，拜仁慕尼黑是德国最大的体育俱乐部和全球第四大足球俱乐部，其于2012年创造的总收入为3.684亿欧元。拜仁慕尼黑还是一家采取会员制的俱乐部，共有超过185,000名付费会员。此外在经俱乐部官方认证的3,202个球迷组织中则另有231,197名成员。拜仁慕尼黑获得了2013年IFFHS世界俱乐部排名第一。
</p>
  <img style=" margin-left: 150px; width:700px" src="举杯.webp">
</div>


   
</body>

</main>
<footer>
    <style>
        p{
          text-align:center;
          font-size:25px;
        }
      </style>
      <p >mia san mia!!! 和我一起关注拜仁慕尼黑足球俱乐部！！！</p>
</footer>
</body>


    
   

    

</html>